<%@ page language="java" contentType="text/html; charset=utf-8"
	pageEncoding="utf-8"%>
<!DOCTYPE html>
<html class="x-admin-sm">
<%
	String path = request.getContextPath();
	String basePath = request.getScheme() + "://" + request.getServerName() + ":" + request.getServerPort()
			+ path + "/";
	request.setAttribute("basePath", basePath);
%>
<head>
<meta charset="UTF-8">
<title>仓库管理</title>
<meta name="renderer" content="webkit">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<meta name="viewport"
	content="width=device-width,user-scalable=yes, minimum-scale=0.4, initial-scale=0.8,target-densitydpi=low-dpi" />
<link rel="stylesheet" href="<%=request.getContextPath()%>/css/font.css">
<link rel="stylesheet"
	href="<%=request.getContextPath()%>/css/xadmin.css">
<script type="text/javascript"
	src="<%=request.getContextPath()%>/lib/layui/layui.js" charset="utf-8"></script>
<script type="text/javascript"
	src="<%=request.getContextPath()%>/js/xadmin.js"></script>
</head>
<body>
	<div class="layui-fluid">
		<div class="layui-row">
			<form class="layui-form" action="">
				<div class="layui-form-item">
					<label for="name" class="layui-form-label"> <span
						class="x-red">*</span>供应商名</label>
					<div class="layui-input-inline">
						<input type="text" id="name" name="name" required=""
							lay-verify="required|namereq" autocomplete="off" class="layui-input">
					</div>
				</div>
				<div class="layui-form-item">
					<label for="personInCharge" class="layui-form-label"> <span
						class="x-red">*</span>负责人</label>
					<div class="layui-input-inline">
						<input type="text" id="personInCharge" name="personInCharge" required=""
							lay-verify="required|persionreq" autocomplete="off" class="layui-input">
					</div>
				</div>
				<div class="layui-form-item">
					<label for="tel" class="layui-form-label"> <span
						class="x-red">*</span>联系电话</label>
					<div class="layui-input-inline">
						<input type="text" id="tel" name="tel" required=""
							lay-verify="required|phones" autocomplete="off" class="layui-input">
					</div>
				</div>
				<div class="layui-form-item">
					<label for="email" class="layui-form-label">电子邮件</label>
					<div class="layui-input-inline">
						<input type="text" id="email" name="email"
							lay-verify="myemail" autocomplete="off" class="layui-input">
					</div>
				</div>
				<div class="layui-form-item">
					<label for="address" class="layui-form-label">供应商地址</label>
					<div class="layui-input-inline">
						<input type="text" id="address" name="address"
							autocomplete="off" class="layui-input">
					</div>
				</div>
				<div class="layui-form-item">
					<label class="layui-form-label"> </label>
					<button class="layui-btn" lay-filter="add" lay-submit="">
						提交</button>
				</div>
			</form>
		</div>
	</div>
	<script>
		layui.use([ 'jquery', 'form', 'layer' ], function() {
			var $ = layui.jquery;
			var form = layui.form, layer = layui.layer;
			//自定义验证规则
			form.verify({
				namereq: function (value, item) {
			        if(value != ""){
			            if(value.length <=0 || value.length > 50){
			             return '供应商名称最多50位';
			           }
			        }
			    },
			    persionreq: function (value, item) {
			        if(value != ""){
			            if(value.length <2 || value.length > 10){
			             return '负责人长度为2-10之间';
			           }
			        }
			    },
				phones: [ /^1[3|4|5|7|8]\d{9}$/, 
					'请输入有效手机号'],
				myemail: function (value, item) {
			        if(value != ""){
			            if(!/^[a-z0-9._%-]+@([a-z0-9-]+\.)+[a-z]{2,4}$|^1[3|4|5|7|8]\d{9}$/.test(value)){
			             return '邮箱格式不对';
			           }
			        }
			    }
			});
			
			//监听提交
			form.on('submit(add)', function(data) {
				// 点击登录按钮
				$.ajax({
					contentType: 'application/json',
					url : '<%=basePath%>supplier/addSuppliers',
					type : 'POST',
					data : JSON.stringify(data.field),
					async : false,
					dataType : "json",
					success : function(data) {
						if (data.errCode == 200) {
							layer.alert("添加成功", {
								icon : 6
							}, function() {
								//关闭当前frame
								xadmin.close();
								// 可以对父窗口进行刷新 
								xadmin.father_reload();
							});
						} else {
							layer.alert(data.errMsg, {
								icon : 6
							});
						}
					},
					error : function(data) {
						layer.alert(data.errMsg, {
							icon : 6
						});
					}
				});
				return false;
			});
		});
	</script>
</body>
</html>